TZclock
| Code = * TZclock.js * TZclock.css | Type = site | Languages = }} TZclock is a JavaScript application that displays timezone-adjusted clocks. * Supports any timezone, not just the user's or UTC * Supports multiple clocks per page * Supports optional daylight saving time It produces, with the basic styling provided, a clock that looks like: # NAME UTCOFF ZONE New_York -5:00 EST # IN ON AT SAVE LETTERS Mar Sun>=8 2:00 1 EDT # 2nd Sunday in March Nov Sun>=1 2:00 0 EST # 1st Sunday in November Installation Use This application looks for HTML elements , but they could be or (rendered) with the class js-tzclock on the page. If it doesn't find any, it exits. If it finds any, it runs. Configuration Configuration of each clock is included on the wiki page inside each element with class js-tzclock. The syntax of the configuration is adapted from tzdata. * Optional comments begin with # (pound/octothorpe) * Spaces in strings must use _ (underscore) *: Underscore is replaced with a space when running * + (plus) is optional for positive time offsets * Basic zone definition must come before any rules ** NAME is location name displayed in clock (any string) ** UTCOFF is offset from UTC (-hh:mm) ** ZONE is the timezone name (any string) * Rules for daylight saving, if there are any, must be in chronological order ** IN is the month name for a rule (3-letter English abbreviation) ** ON is the date (numerical date, lastDay, or Day>=date) **: If used, Day is the 3-letter English abbreviation ** AT is the standard time at which the rule takes effect (24-hour) ** SAVE is the amount of time added to standard time (hh:mm) ** LETTERS is the zone name when the rule is in effect (any string) Simple mode By setting window.TZclockSimpleFormat to true, you can make the clock display a simpler version of the time. Styling The stylesheet TZclock.css provides basic styling, facilitating centering the clock text inside the js-tzclock element and underlining the location name. There are three additional classes available for further styling the clocks. Additional styling, if any, should be done in your site's MediaWiki:Common.css. # js-tzclock-wrap - child of js-tzclock, wraps both the location name and the time # js-tzclock-lctn - child of js-tzclock-wrap, applies to the location name only # js-tzclock-time - child of js-tzclock-wrap, applies to the time only Example clock configurations ; New York # NAME UTCOFF ZONE New_York -5:00 EST # IN ON AT SAVE LETTERS Mar Sun>=8 2:00 1 EDT # 2nd Sunday in March Nov Sun>=1 2:00 0 EST # 1st Sunday in November ; London # NAME UTCOFF ZONE London 0:00 GMT # IN ON AT SAVE LETTERS Mar lastSun 1:00 1 BST # last Sunday in March Oct lastSun 1:00 0 GMT # last Sunday in October ; Tokyo # NAME UTCOFF ZONE Tokyo 9:00 JST # no daylight time in Japan ; Adelaide # NAME UTCOFF ZONE Adelaide +9:30 CST # IN ON AT SAVE LETTERS Apr Sun>=1 2:00 0 CST # 1st Sunday in April Oct Sun>=1 2:00 1 CDT # 1st Sunday in October may not be essential for all clock configurations, but it is recommended to stop MediaWiki from interfering with them.